<template>
  <page-header-wrapper>
    <a-card>
      <a-table :columns="columns" :data-source="data">
        <span slot="applyDate" slot-scope="applyDate"> {{ humanizeDate(applyDate) }}</span>
        <span slot="preLoanDate" slot-scope="preLoanDate"> {{ humanizeDate(preLoanDate) }}</span>
        <span slot="principal" slot-scope="principal"> {{ moneyType(principal) }}</span>
        <span slot="capital" slot-scope="capital"> {{ moneyType(capital) }}</span>
        <span slot="asseApprove" slot-scope="_, record">
          <LoanAppr :record="record" @update="getData" />
        </span>
        <span slot="operation" slot-scope="_, record">
          <richTextDialog :record="record" :type="2"></richTextDialog>
        </span>
      </a-table>
    </a-card>
  </page-header-wrapper>
</template>
<script>
import moment from 'moment'
import { getAddLoan } from '@/api/common'
const columns = [
  {
    title: '项目编号',
    dataIndex: 'projectNum',
    key: 'projectNum'
  },
  {
    title: '项目地址',
    dataIndex: 'addr',
    key: 'addr',
    width: 90
  },
  {
    title: '加贷本金金额',
    dataIndex: 'principal',
    key: 'principal',
    scopedSlots: { customRender: 'principal' }
  },
  {
    title: '加贷资金成本',
    dataIndex: 'capital',
    key: 'capital',
    scopedSlots: { customRender: 'capital' }
  },
  {
    title: '加贷用途',
    dataIndex: 'usage',
    key: 'usage'
  },
  {
    title: '加贷申请日期',
    dataIndex: 'applyDate',
    key: 'applyDate',
    scopedSlots: { customRender: 'applyDate' }
  },
  {
    title: '加贷出借人手续费(%)',
    dataIndex: 'rate',
    key: 'rate'
  },
  {
    title: '预计放款时间',
    dataIndex: 'preLoanDate',
    key: 'preLoanDate',
    scopedSlots: { customRender: 'preLoanDate' }
  },
  {
    title: '审批',
    dataIndex: 'asseApprove',
    key: 'asseApprove',
    scopedSlots: { customRender: 'asseApprove' }
  },
  {
    title: '操作',
    dataIndex: 'operation',
    key: 'operation',
    scopedSlots: { customRender: 'operation' }
  }
]
export default {
  name: 'AddLoan',
  data() {
    return {
      columns,
      data: []
    }
  },
  components: {
    LoanAppr: () => import('./com/LoanAppr.vue'),
    richTextDialog: () => import('./com/RichTextDialog.vue')
  },
  mounted() {
    this.getData()
  },
  methods: {
    humanizeDate(v) {
      if (v) {
        return moment(v * 1000).format('YYYY-MM-DD') || '--'
      } else {
        return '-'
      }
    },
    moneyType(v) {
      return `${v}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
    },
    async getData() {
      const form = {
        approve: 2,
        asseApprove: 2,
        nzApprove: 1
      }
      const res = await getAddLoan(form)
      // console.log(res.result.data.list)
      this.data = res.result.data.list
    }
  }
}
</script>
<style lang="css" scoped></style>
